<template>
	<div id="userTemplates">
		<div class="title"><a class="backPage iconfont icon-icon-test" @click="$router.back(-1)"></a>用户模板列表</div>
		<el-table :data="tableData" border :loading="loading > 0">
			<el-table-column label="模板名称" :show-overflow-tooltip="true">
				<template slot-scope="scope">
					<div class="userHead" @click="goDetail(scope.row.id)">
						<img :src="scope.row.icon" class="square" />
						{{scope.row.name}}
					</div>
				</template>
			</el-table-column>
			<el-table-column label="所属分类" :show-overflow-tooltip="true">
				<template slot-scope="scope">
					{{scope.row.first_name}} - {{scope.row.seconde_name}}
				</template>
			</el-table-column>
			<el-table-column label="更新时间" :show-overflow-tooltip="true">
				<template slot-scope="scope">
					{{scope.row.time_created | dateFormat}}
				</template>
			</el-table-column>
			<el-table-column prop="btn" label="操作" :show-overflow-tooltip="true">
				<template slot-scope="scope">
					<div class="tableBtn">
						<span class="blue" @click="goDetail(scope.row.id)">查看</span>
						<el-popconfirm title="真的要删除这条信息吗?" @onConfirm="onDel(scope.row.id)">
							<a class="gray" slot="reference">删除</a>
						</el-popconfirm>
					</div>
				</template>
			</el-table-column>
		</el-table>
		<div class="paginationBlock">
			<el-pagination @current-change="changePage" layout="prev, pager, next, total" :total="count" :current-page="page" :page-size="pageSize" hide-on-single-page></el-pagination>
		</div>
	</div>
</template>

<script>
import fetch from '@/api/axios';
import {sysToYuan} from '@/utils/transPrice';
import {tsToDateFormat} from '@/utils/tsToDateFormat';
export default {
	data() {
		return {
			uid: 0,
			loading: 0,
			page: 1,
			pageSize: 10,
			count: 0,
			tableData:[],
		}
	},
	filters: {
		dateFormat(t){
			return tsToDateFormat(t, 'yyyy-MM-dd hh:mm');
		},
	},
	created(){
		this.uid = this.$route.query.uid;
		this.getList();
	},
	methods: {
		getList(){
			let _this = this;
			this.loading += 1;
			fetch.get('/api/console/user/template',{
				page: _this.page,
				user_id: _this.uid,
			}).then((res)=>{
				let data = res.data;
				if(data.code == 0){
					_this.count = data.data.count;
					_this.pageSize = data.data.pagesize;
					_this.tableData = [...data.data.result];
				}else{
					_this.$message.error(data.message);
				}
			}).catch((err)=>{
				_this.$message.error(err.message);
			}).finally(()=>{
				_this.loading -= 1;
			});
		},
		changePage(page){
			let type = this.type;
			this.page = page;
			this.$router.replace(`/user/template?uid=${this.uid}&page=${page}`);
			this.getList();
		},
		onDel(id){
			let _this = this;
			this.loading = true;
			fetch.get('/api/console/user/template', {
				method: 'delete',
				id: id
			}).then(res=>{
				let data = res.data;
				if(data.code == 0){
					_this.$message.success('删除成功');
					_this.getList();
				}else{
					_this.$message.error(data.data.info);
				}
			}).catch(err=>{
				_this.$message.error('网络请求失败，请稍后重试');
			}).finally(()=>{
				_this.loading -= 1;
			});
		},
		goDetail(id){
			this.$router.push(`/user/templateDetail?id=${id}`);
		},
	},
	mounted() {

	},
	watch: {
		'$route':function(to){
			let query = to.query;
			this.page = parseInt(query.page);
		}
	}
}
</script>
<style lang="scss" scoped>
	
</style>